<template>
    <div>
         <h1>添加会员等级</h1>
         <table>

            <tbody>

                <tr>
                    <td align="right">等级名称</td>
                    <td>
                        <input type="text" v-model="querInfo.LevelName"/>
                    </td>
                </tr>
                <tr>
                    <td align="right">累计消费金额</td>
                    <td>
                        <input type="text" v-model="querInfo.Money"/>
                    </td>
                </tr>
                <tr>
                    <td align="right">等级名称</td>
                    <td>
                        <input type="button" value="添加" @click="ok"/>
                    </td>
                </tr>

            </tbody>

         </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive} from  'vue';
import axios  from "axios";
//any表示任意数据类型
let querInfo:any=reactive
({
  "LevelName": "",
  "Money": ""
})

const ok=()=>
{
    //验证数据的有效性
   if(querInfo.LevelName=="")
   {
    alert("请输入等级名称");
    return;
   }
   if(querInfo.Money=="")
   {
    alert("请输入累计消费金额");
    return;
   }
   //发送请求
   //axios发送请求
   axios
   ({
    url:'https://localhost:7201/api/Members/AddMember',//请求地址
    method:'post',//请求方式
    data:querInfo//请求参数
   })
   .then(res=>
   {
    //相当于success  表示请求成功  res 表示请求成功后返回的数据
    console.log(res);
    if(res.data>0)
   {
    alert("添加成功");
   }
   else
   {
    alert("添加失败");
   }
   })
   .catch(err=>
   {
//then  相当于 error   表示请求失败， err  表示请求后返回的数据
   })
}
</script>

<style scoped>

</style>